<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./CSS/swiper-bundle.css">
    <link rel="stylesheet" href="./font/蓝铅笔/iconfont.css">
    <link rel="stylesheet" href="./font/play/iconfont.css">
    <link rel="stylesheet" href="font/响应式底部/iconfont.css">
    <link rel="stylesheet" href="./font/蓝铅笔网校-移动端font/iconfont.css">
    <link rel="stylesheet" href="./CSS/reset.css">
    <link rel="stylesheet" href="./CSS/normalize.css">
    <link rel="stylesheet" href="./CSS/蓝铅笔头部-移动端.css">
    <link rel="stylesheet" href="./CSS/蓝铅笔尾部-移动端.css">
    <link rel="stylesheet" href="./CSS/蓝铅笔网校-移动端.css">
</head>
<body>
    <div class="header-box">
        <div class="header1">
            <div class="header-heart">
                <div class="logo">
                   <a href="#"><img src="./蓝铅笔漫步images/logo.png" alt=""></a> 
                </div>
                <div class="search">
                   <a href="#"><i class="iconfont icon-sousuo"></i></a> 
                </div>
                <div class="login">
                  <div class="login-box">
                    <div class="login-img">
                        <img src="./蓝铅笔漫步images/1.png" alt="">
                    </div>
                    <div class="login-font">
                        <a href="#">登录</a>
                        <a href="#">注册</a>
                    </div>
                </div>
                </div>
            </div>
        </div>
    </div>
    <div class="adv-box">
        <div class="adv">
            <a href="#"><img src="./蓝铅笔漫步images/164.png" alt=""></a>
        </div>
    </div>
    <div class="adv2">
        <div class="adv2-heart">
            <div class="adv2-img">
               <a href="#"><img src="./蓝铅笔漫步images/167.png" alt=""></a> 
            </div>
        </div>
    </div>
    <div class="apply">
        <div class="apply-heart">
            <ul class="apply-heart-ul">
                <li class="apply-ul-li">
                    <a href="#">
                        <img src="./蓝铅笔漫步images/168.png" alt="">
                        <span>直播课</span>
                    </a>
                </li>
                <li class="apply-ul-li">
                    <a href="#">
                        <img src="./蓝铅笔漫步images/169.png" alt="">
                        <span>录播课</span>
                    </a>
                </li>
                <li class="apply-ul-li">
                    <a href="#">
                        <img src="./蓝铅笔漫步images/170.png" alt="">
                        <span>企业荣誉</span>
                    </a>
                </li>
                <li class="apply-ul-li">
                    <a href="#">
                        <img src="./蓝铅笔漫步images/171.png" alt="">
                        <span>学员作品</span>
                    </a>
                </li>
                <li class="apply-ul-li">
                    <a href="#">
                        <img src="./蓝铅笔漫步images/172.png" alt="">
                        <span>学员成长</span>
                    </a>
                </li>
                <li class="apply-ul-li">
                    <a href="#">
                        <img src="./蓝铅笔漫步images/173.png" alt="" title="怎么样学习">
                        <span>怎么样学习</span>
                    </a>
                </li>
            </ul>
        </div>
    </div>
    <div class="course">
        <div class="course-heart">
            <div class="course-title">
                <h2><a href="#">网校课程</a></h2>
                <a href="#">
                    <span>全部</span>
                    <i class="iconfont icon-youjiantou"></i>
                </a>
            </div>
            <div class="course-content">
                <ul class="course-content-ul">
                    <li class="course-content-ul-li">
                        <a href="#">
                            <div class="course-content-img">
                                <img src="./蓝铅笔漫步images/30.png" alt="">
                                <span>[陪学陪练]每日1画·成长营</span>
                            </div>
                        </a>
                    </li>
                    <li class="course-content-ul-li">
                        <a href="#">
                            <div class="course-content-img">
                                <img src="./蓝铅笔漫步images/32.png" alt="">
                                <span>[陪学陪练]每日1画·成长营</span>
                            </div>
                        </a>
                    </li>
                    <li class="course-content-ul-li">
                        <a href="#">
                            <div class="course-content-img">
                                <img src="./蓝铅笔漫步images/33.png" alt="">
                                <span>[陪学陪练]每日1画·成长营</span>
                            </div>
                        </a>
                    </li>
                    <li class="course-content-ul-li">
                        <a href="#">
                            <div class="course-content-img">
                                <img src="./蓝铅笔漫步images/37.png" alt="">
                                <span>[陪学陪练]每日1画·成长营</span>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="teacher">
        <div class="teacher-heart">
            <div class="course-title">
                <h2><a href="#">优秀师资</a></h2>
                <a href="#">
                    <span>全部</span>
                    <i class="iconfont icon-youjiantou"></i>
                </a>
            </div>
        <div class="teacher-content">
            <ul class="teacher-ul">
                <li class="teacher-ul-li">
                   <div class="teacher-img">
                    <a href="#"><img src="./蓝铅笔漫步images/144.JPG" alt=""></a>
                   </div>
                   <div class="teacher-name">
                    <a href="#">DAdonika</a>
                    <i class="iconfont icon-vip"></i>
                   </div>
                   <div class="teacher-time">
                    <span>行业经验：6年</span>
                   </div>
                </li>
                <li class="teacher-ul-li">
                    <div class="teacher-img">
                     <a href="#"><img src="./蓝铅笔漫步images/145.jpg" alt=""></a>
                    </div>
                    <div class="teacher-name">
                     <a href="#">黑沢芥子</a>
                     <i class="iconfont icon-vip"></i>
                    </div>
                    <div class="teacher-time">
                     <span>行业经验：7年</span>
                    </div>
                 </li>
                 <li class="teacher-ul-li">
                    <div class="teacher-img">
                     <a href="#"><img src="./蓝铅笔漫步images/146.jpg" alt=""></a>
                    </div>
                    <div class="teacher-name">
                     <a href="#">CPKon</a>
                     <i class="iconfont icon-vip"></i>
                    </div>
                    <div class="teacher-time">
                     <span>行业经验：7年</span>
                    </div>
                 </li>
            </ul>
        </div>
    </div>
    </div>
    <div class="student">
        <div class="student-heart">
            <div class="course-title">
                <h2><a href="#">学员感言</a></h2>
                <a href="#">
                    <span>全部</span>
                    <i class="iconfont icon-youjiantou"></i>
                </a>
            </div>
            <div class="student-content">
                <ul class="student-content-ul">
                    <li class="student-content-ul-li">
                       <div class="student-img">
                         <a href="#"><img src="./蓝铅笔漫步images/147jpg.jpg" alt=""></a>
                       </div>
                        <div class="student-font">
                          <h5>文静：</h5>
                          <span>一直想学动画，偶然的机会看到蓝铅笔这个网站。在蓝铅笔学习时间自由，老师一对一辅导，是一个特别适合在校生学习的平台；老师也很专业，很耐心，教授的都是行业里前段...</span>
                        </div>
                    </li>
                    <li class="student-content-ul-li">
                        <div class="student-img">
                          <a href="#"><img src="./蓝铅笔漫步images/148.jpg" alt=""></a>
                        </div>
                         <div class="student-font">
                           <h5>邱嘉馨：</h5>
                           <span>我是在机缘巧合之下，认识蓝铅笔的。那是在腾讯的蓝铅笔公开课上认识的，我本来对网上课程不太了解，也就抱着试试的态度，便去听了一节课。
                            发现还挺好的，老师的解......</span>
                         </div>
                     </li>
                     <li class="student-content-ul-li">
                        <div class="student-img">
                          <a href="#"><img src="./蓝铅笔漫步images/149.jpg" alt=""></a>
                        </div>
                         <div class="student-font">
                           <h5>朱明辉：</h5>
                           <span>我现在还是一名大四动画专业的学生，现在在一家动画公司工作，很热爱我的工作，对动画很感兴趣。
                            在大一到大三的课程当中，学校讲的东西太多，软件就学了十来个，主......</span>
                         </div>
                     </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="opus">
        <div class="opus-heart">
            <div class="course-title">
                <h2><a href="#">学员作品</a></h2>
                <a href="#">
                    <span>全部</span>
                    <i class="iconfont icon-youjiantou"></i>
                </a>
            </div>
            <div class="opus-content">
                <ul class="opus-ul">
                    <li class="opus-ul-li">
                        <a href="#">
                            <img src="./蓝铅笔漫步images/80.jpg" alt="">
                        </a>
                    </li>
                    <li class="opus-ul-li">
                        <a href="#">
                            <img src="./蓝铅笔漫步images/81.jpg" alt="">
                        </a>
                    </li>
                    <li class="opus-ul-li">
                        <a href="#">
                            <img src="./蓝铅笔漫步images/83.jpg" alt="">
                        </a>
                    </li>
                    <li class="opus-ul-li">
                        <a href="#">
                            <img src="./蓝铅笔漫步images/85.jpg" alt="">
                        </a>
                    </li>
                    <li class="opus-ul-li">
                        <a href="#">
                            <img src="./蓝铅笔漫步images/86.jpg" alt="">
                        </a>
                    </li>
                    <li class="opus-ul-li">
                        <a href="#">
                            <img src="./蓝铅笔漫步images/87.jpg" alt="">
                        </a>
                    </li>
                    <li class="opus-ul-li">
                        <a href="#">
                            <img src="./蓝铅笔漫步images/88.jpg" alt="">
                        </a>
                    </li>
                    <li class="opus-ul-li">
                        <a href="#">
                            <img src="./蓝铅笔漫步images/90.jpg" alt="">
                        </a>
                    </li>
                    <li class="opus-ul-li">
                        <a href="#">
                            <img src="./蓝铅笔漫步images/94jpg.jpg" alt="">
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="small-mask-box">
        <div class="small-mask">
           <div class="small-mask-heart">
               <ul class="small-mask-heart-ul">
                   <li class="small-mask-heart-ul-li">
                       <a href="./蓝铅笔首页-移动端.html">
                           <p><i class="iconfont icon-shouye-shouye"></i></p>
                           <p><span>首页</span></p>
                       </a>
                   </li>
                   <li class="small-mask-heart-ul-li">
                       <a href="./蓝铅笔移动端-教程.html">
                           <p><i class="iconfont icon-diannao"></i></p>
                           <p><span>教程</span></p>
                       </a>
                   </li>
                   <li class="small-mask-heart-ul-li">
                       <a href="./蓝铅笔网校-移动端.html">
                           <p><i class="iconfont icon-wenzhang"></i></p>
                           <p><span>网校</span></p>
                       </a>
                   </li>
                   <li class="small-mask-heart-ul-li">
                       <a href="./蓝铅笔大触-移动端.html">
                           <p><i class="iconfont icon-chengshijinglixianxing"></i></p>
                           <p><span>大触</span></p>
                       </a>
                   </li>
                   <li class="small-mask-heart-ul-li">
                       <a href="./蓝铅笔移动端-社区.html">
                           <p><i class="iconfont icon-taolun"></i></p>
                           <p><span>社区</span></p>
                       </a>
                   </li>
               </ul>
           </div>
        </div>
       </div>
</body>
</html>